<template>
  <div class="reSetPwd">
    <Header title="修改手机号" />
    <ul class="content">
      <li>
        <span>原密码</span>
        <input type="password" placeholder="请输入原密码" />
      </li>
      <li>
        <span>新密码</span>
        <input type="password" placeholder="请输入新密码" />
      </li>
      <li>
        <span>确认密码</span>
        <input type="password" placeholder="请输入确认密码" />
      </li>
    </ul>
    <div class="footer">
      <button class="btn" @click="$router.push({ path: '/my', query: { pwd: '111222' } })">完成</button>
    </div>
  </div>
</template>
<script lang="ts">
import Vue from "vue";
import Header from "@/components/header.vue";
export default Vue.extend({
  data() {
    return {
      isEeye: true,
      isGet: false,
      num: 10,
      times: setInterval(() => {}),
    };
  },
  components: {
    Header,
  },
  methods: {
    timeFun() {
      this.isGet = true;
      this.times = setInterval(() => {
        this.num -= 1;
        console.log(this.num);
        if (this.num === 0) {
          this.num = 10;
          clearInterval(this.times);
          this.isGet = false;
        }
      }, 1000);
    },
  },
  destroyed() {
    clearInterval(this.times);
  },
});
</script>
<style scoped>
.content li {
  padding: 12px 8px;
}

.footer {
  width: 100%;
  text-align: center;
  font-size: 16px;
}
.footer p {
  margin-top: 15px;
}
.btn {
  width: 90%;
}
</style>
